/* 
  目标： 深入props，使用children属性，来自定义组件内容
  目标2：
  理解：children属性代表了组件的内容
  步骤：
  1. 设置组件的内容
  2. 通过props.children获取： {this.props.children}
*/
import React from 'react';

export default class App extends React.Component {
  render() {
    return (
      <div>
        {/* 1. 设置组件的内容 */}
        <Hello>
          <h1>我是hello组件的内容</h1>
        </Hello>
      </div>
    );
  }
}

class Hello extends React.Component {
  render() {
    console.log(this.props, 'props');
    // 通过props.children获取
    return (
      <div>
        我是hello组件
        {this.props.children}
      </div>
    );
  }
}
